<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>CSS盒子模型示例</title>
    <style>
        /* 标准盒子模型示例 */
        .box-standard {
            width: 200px;
            height: 100px;
            padding: 20px;
            border: 2px solid #333;
            margin: 30px;
            background: #f0f0f0;
            box-sizing: content-box; /* 标准模型：width仅包含内容区 */
        }
        
        /* IE盒子模型示例 */
        .box-ie {
            width: 200px;
            height: 100px;
            padding: 20px;
            border: 2px solid #333;
            margin: 30px;
            background: #f0f0f0;
            box-sizing: border-box; /* IE模型：width包含内容区+内边距+边框 */
        }
    </style>
</head>
<body>
    <div class="box-standard">这是标准盒子模型实例</div>
    <div class="box-ie">这是IE盒子模型实例</div>
</body>
</html>